import React,{Component} from 'react';
import { TabBar } from 'antd-mobile';
import { Route } from "react-router-dom";

// 引入模块
import Index from '../index';
import Found from '../found'
import My from '../my'


class Home extends Component {
   
    render() { 
        const {location} = this.props;
        return ( 
            <div style={{ position: 'fixed', height: '100%', width: '100%', top: 0 }}>
            <TabBar
            unselectedTintColor="#949494"
            tintColor="#28ba85"
            barTintColor="white"
            >
            <TabBar.Item
                title="首页"
                key="Index"
                icon={<i className="iconfont icon-ind" style={{ fontSize: "18px" }}  ></i>}
                selectedIcon={<i className="iconfont icon-ind" style={{ color: "#28ba85", fontSize: "18px" }}  ></i>}
                selected={location.pathname === '/home/index'}
                onPress={() => {
                this.props.history.push("/home/index")
                }}
                data-seed="logId"
            >
                <Route path="/home/index" component={Index} />
            </TabBar.Item>
            <TabBar.Item
                icon={
                <i className="iconfont icon-findHouse" style={{fontSize:"18px"}}></i>
                }
                selectedIcon={
                    <i className="iconfont icon-findHouse" style={{color: "#28ba85", fontSize:"18px"}}></i>
                }
                title="找房"
                key="found"
                selected={location.pathname === '/home/found'}
                onPress={() => {
                   console.log(this.props.history);
                   this.props.history.push("/home/found")
                }}
                data-seed="logId1"
            >
                <Route path="/home/found" component={Found} />
            </TabBar.Item>
            <TabBar.Item
                icon={<i className="iconfont icon-my" style={{fontSize:"18px"}}></i>}
                selectedIcon={<i className="iconfont icon-my" style={{color: "#28ba85",fontSize:"18px"}}></i>}
                title="我的"
                key="my"
                selected={location.pathname === '/home/my'}
                onPress={() => {
                    this.props.history.push('/home/my')
                }}
            >
                <Route path="/home/my" component={My} />
            </TabBar.Item>
            </TabBar>
      </div>
    );
    }
}
 
export default Home;
